<template>
    <el-collapse-item name="request">
    <template #title>
      request
      <el-icon class="header-icon">
      </el-icon>
    </template>
            <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">url</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.url}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">method</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.method}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">headers</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.headers}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">status_code</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.status_code}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">setup_hooks_start</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.setup_hooks_start}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">setup_hooks_duration</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.setup_hooks_duration}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">json</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.json}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">body</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.body}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">url</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.url}}</el-col>
          </el-row>
          <el-divider />
          <el-row :gutter="10">
            <el-col :span="2" align="center">
              <div >
                <el-icon><Checked /></el-icon>
              </div>
            </el-col>
            <el-col :span="5" align="center">url</el-col>
            <el-col :span="16" align="center">{{this.meta_data.request.url}}</el-col>
          </el-row>
    <div>
    </div>
  </el-collapse-item>
</template>